
<!--分页查询共用的页面-->
<%@ include file="/common/paginateUtil.jsp"%>

<%@ include file="/common/dateUtil.jsp"%>
  <%@ page language="java" pageEncoding="UTF-8"%>

	<style>
        select {
			width:80px;
	    }
		input 
		{
			width:150px;
		}
		.vpic
		{
			height:150px;
		}
	</style>
</head>

		<script type="text/javascript" charset="utf-8">
            function getFileSourceColumn(value, rowData, rowIndex) {
                 return value == "ftp" ? "FTP上传" : "服务器缓存";
            }

            function getPlayerActionColumn(alue, rowData, rowIndex)
            {
                var resourceId = rowData.baseId;
                var html =  "<a href=\"javascript:InfoWindow.viewVideoResourcePlayer('" + resourceId+ "');\">" +" 播放</a>";
                return html;
            }
                 function getDownloadActionColumn(alue, rowData, rowIndex)
                 {
                     var resourceId = rowData.baseId;
                     var filePath = rowData.filePath;
                     var status = rowData.status;
                     var html = status;
                     if(status == "uploading")
                         html = "终端正在上传";
                     else if(status == "upload_failed")
                     {
                         html = "终端上传失败";
                     }
                     else if(status == "upload_completed" || status == "上传完成")
                     {
                         var url = "<%=ApplicationPath%>/videoDownload/downloadVideoFile.action?filePath=" + filePath;
                         html =  "<a href=\"javascript:window.open('" + url+ "');\">" +" 下载</a>";
                         html += "&nbsp;&nbsp;&nbsp;&nbsp;";
                         html += "<a href=\"javascript:InfoWindow.viewVideoResourcePlayer('" + resourceId+ "');\">" +" 播放</a>";

                     }
                     return html;
                 }

                 function playMultiChannel()
				 {
                     //获取checkbox选中的行的区域Id
                     var checkedItems = $('#queryGrid').datagrid('getChecked');
                     var strResourceId = [];
                     $.each(checkedItems, function(index, item){
                         strResourceId.push(item.baseId);
                     });
                     if(strResourceId.length == 0)
                     {
                         $.messager.alert("提示","请选择要播放的记录!");
                         return;
                     }
                     InfoWindow.viewVideoResourcePlayer(strResourceId);
				 }

            //填充报警标志下拉框
            function initAlarmTypeList(alarmTypeList)
            {
                $('#alarm').combotree({
                    valueField: "alarmType", //Value字段
                    textField: "name", //Text字段
                    multiple: true,
                    data: alarmTypeList,
                    onCheck: function (node, checked) {
                        //让全选不显示
                        $("#alarm").combotree("setText", $("#alarm").combobox("getText").toString().replace("全选,", ""));
                        var values = $('#alarm').combotree("getValues");
                        var strAlarm = values.join(",");
                        $("#alarmStatus").val(strAlarm);
                    },
                    onClick: function (node, checked) {
                        //让全选不显示
                        $("#alarm").combotree("setText", $("#alarm").combobox("getText").toString().replace("全选,", ""));
                    }
                });

                $("#alarm").combotree("setText","不指定报警");
            }
			$(document).ready(function() {
                var url = '<%=ApplicationPath%>/alarmConfig/terminalAlarmTypeList.action';
                $.getJSON(url, null, function(result)
                {
                    if(result.success)
                    {
                        initAlarmTypeList(result.data);
                    }
                });
                $("#alarmType").lookup({queryID:"selectAlarmTypeList"});
				   var now = Utility.today(1);
				  $("#endDate").val(now + " 23:59:00");
				  var now = Utility.today();
				  $("#startDate").val(now + " 00:00:00");

			     //创建下拉部门树
				Utility.createDepTree("depId");
				$("#btnQuery").click(function(){
				        Utility.loadGridWithParams();
				});
                Utility.loadGridWithParams();

                $("#btnPlayMultiChannel").click(function(){
                    playMultiChannel();
                });
			} );
		</script>
<body>
		<div id="toolbar">		
			
			<form id="queryForm" action="<%=ApplicationPath%>/report/paginate.action">
				<input type="hidden" name="queryId" value="videoFileItem.selectVideoFileItems" />   
			   <input type="hidden" name="fileName" value="服务器录像文件管理" />	    
			   <input type="hidden" name="mediaTypeName" id="mediaTypeName" value="" />
				<input type="hidden" name="alarmStatus" id="alarmStatus" value="" />
				<input type="hidden" name="serverFile" id="serverFile" value="yes" />
				<table width="100%"  class="TableBlock">
			   			   <tr>
						    <td> 车牌号码 </td>
					<td>			   
					<input type="text" id="plateNo" name="plateNo" > 
					</td>
				   <td> 车组名称 </td>
					<td>			   
				<select id="depId" name="depId" style="width:200px;"></select>
               </td>
				<td align="right">文件来源
							:</td>
						<td><select id="文件来源"  style="width: 150px;" name="fileSource">
						          <option value="">所有</option>
						          <option value="ftp">FTP上传</option>
						          <option value="record">服务器缓存</option>
						   </select></td>
							   <td>报警类型</td>
							   <td>
								   <select id="alarm" class="easyui-combotree" style="width: 200px; height: 24px;">
								   </select></td>
            </tr>
				<tr>
						
						<td align="right">开始时间
							:</td>
						<td>
      <input type="text" name="startDate" id="startDate" class="datetimepicker"></input>
						</td>
						<td>结束时间:</td>
						<td align="left">
							  <input type="text" name="endDate" id="endDate" class="datetimepicker"></input>
						</td>
				
        <td colspan="4" align="left">
	       <a id="btnQuery" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" >查询</a>&nbsp;
			<a id="btnPlayMultiChannel" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" >多通道播放</a>&nbsp;
		   <a id="btnReset" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-clear'" >重置</a>&nbsp;
			<a id="btnExport" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-excel'"
			   onclick="Utility.excelExport('<%=ApplicationPath%>/export.action');">导出</a><!--调用utility.js-->
        </td>
    </tr>
		</table>
		</form>	 
		
  </div>
			<table id="queryGrid" class="easyui-datagrid"
			   data-options="pagination:true,pageSize:15,singleSelect:true,rownumbers:true,striped:true,fitColumns: true,
						pageList: [15, 20, 50, 100, 150, 200],fit:true,toolbar:'#toolbar',checkOnSelect: false, selectOnCheck: false,
						url:'<%=ApplicationPath%>/report/paginate.action',method:'get'">
					<thead>
						<tr>
							<th data-options="field:'baseId',checkbox:true"   width="100">选择</th>

							<th data-options="field:'plateNo'" width="6%">车牌号</th>
							<th data-options="field:'plateColor'" width="4%">颜色</th>
							<th data-options="field:'channelId'" width="5%">通道</th>
							<th data-options="field:'fileSource',formatter:getFileSourceColumn" width="6%">文件来源</th>
							<th data-options="field:'startDate'" width="12%">开始时间</th>
							<th data-options="field:'endDate'" width="12%">结束时间</th>
							<th data-options="field:'filePath',formatter:getDownloadActionColumn" width="8%">状态</th>
							<th data-options="field:'alarmStateDescr'" width="8%">报警标志</th>
							<th data-options="field:'dataType'" width="8%">资源类型</th>
							<th data-options="field:'streamType'" width="8%">码流类型</th>
							<th data-options="field:'timeSpan'" width="8%">时间长度</th>
							<th data-options="field:'fileLength'" width="8%">文件大小(KB)</th>
							<th data-options="field:'longitude1'" width="8%">开始经度</th>
							<th data-options="field:'latitude1'" width="8%">开始纬度</th>
							<th data-options="field:'longitude2'" width="8%">结束经度</th>
							<th data-options="field:'latitude2'" width="8%">结束纬度</th>
							<th data-options="field:'storeType'" width="6%">存储器</th>
							<th data-options="field:'createDate'" width="12%">创建时间</th>
						</tr>
					</thead>
					<tbody>
						
					</tbody>					
				</table>

</body>

